<template>
  <view class="mine-container">
<view id="main" style="width: 100%;height: 400px;"></view>
<view>
		<el-table
		    :data="tableData"
		    stripe
		    style="width: 100%"
			:row-class-name="tableRowClassName">
		    <el-table-column
		      prop="custWill"
		      label="跟进状态"
		      >
		    </el-table-column>
		    <el-table-column
		      prop="number"
		      label="数量"
		      >
		    </el-table-column>
		    <el-table-column
		      prop="ritio"
		      label="转化率"
			  >
		    </el-table-column>

		  </el-table>
	</view>
  </view>
</template>

<script>
  import storage from '@/utils/storage'
  import * as echarts from 'echarts';
  

  
  export default {
    data() {
      return {
		  tableData:[]
        }
    },
onLoad() {
	
	uni.request({
		url:'http://localhost:8089/crmdemo/contract/queryCustWill',
		success: (res) => {
			
			this.tableData = res.data.result;

		}
	});
	
},
mounted() {
	var chartDom = document.getElementById('main');
	var myChart = echarts.init(chartDom);
	var option;
	option = {
  tooltip: {
    trigger: 'item'
  },
  legend: {
    top: '5%',
    left: 'center'
  },
  series: [
    {
      name: 'Access From',
      type: 'pie',
      radius: ['40%', '70%'],
      avoidLabelOverlap: false,
      itemStyle: {
        borderRadius: 10,
        borderColor: '#fff',
        borderWidth: 2
      },
      label: {
        show: false,
        position: 'center'
      },
      emphasis: {
        label: {
          show: true,
          fontSize: 40,
          fontWeight: 'bold'
        }
      },
      labelLine: {
        show: false
      },
      data: [
       { value: 45, name: '方案报价' },
       { value: 39, name: '合同签订' },
       { value: 48, name: '初次沟通' }
      ]
    }
  ]
}
	option && myChart.setOption(option)
},
    methods: {
		
	}
   
  }
</script>






<style lang="scss">
  page {
    background-color: #f5f6f7;
  }

  .mine-container {
    width: 100%;
    height: 100%;


    .header-section {
      padding: 15px 15px 45px 15px;
      background-color: #3c96f3;
      color: white;

      .login-tip {
        font-size: 18px;
        margin-left: 10px;
      }

      .cu-avatar {
        border: 2px solid #eaeaea;

        .icon {
          font-size: 40px;
        }
      }

      .user-info {
        margin-left: 15px;

        .u_title {
          font-size: 18px;
          line-height: 30px;
        }
      }
    }

    .content-section {
      position: relative;
      top: -50px;

      .mine-actions {
        margin: 15px 15px;
        padding: 20px 0px;
        border-radius: 8px;
        background-color: white;

        .action-item {
          .icon {
            font-size: 28px;
          }

          .text {
            display: block;
            font-size: 13px;
            margin: 8px 0px;
          }
        }
      }
    }
  }
</style>
